import React from "react";
import { Radio, Space } from "antd-mobile";
import style from "../../css/setting/AutoResponse.module.css";
import { useNavigate } from "react-router-dom";
import { NavBar } from "antd-mobile";
export default function AutoResponse() {
  const navigate = useNavigate();
  const back = () => {
    navigate(-1);
  };
  const data = [
    {
      id: 1,
      title: "默认回复",
      text: "亲，我现在不在线，商品还在，可以直接拍，有问题请留言",
    },
    {
      id: 2,
      title: "出价低于95折",
      text: "亲，你说的这个价真的没办法，买新的要xx元(商品原价/淘宝同款价)，你可以在看看考虑下",
    },
    {
      id: 3,
      title: "是否能便宜",
      text: "亲，亲价格很低了，不能在便宜了，晚了东西可能会被别人拍下哈",
    },
    {
      id: 4,
      title: "还有货嘛",
      text: "亲,我现在不在线,商品还在，可以直接拍。有问题请留言",
    },
  ];
  return (
    <>
      <NavBar onBack={back}>自动回复</NavBar>
      <Radio.Group  defaultValue={1}>
      {data.map(item =><div className={style.box} key={item.id}>
        
         <Radio value={item.id} className={style.blockIndicator}></Radio>
        <div className={style.right}>
          <div style={{ display: "flex", justifyContent: "space-between" }}>
            <p style={{ fontSize: "14px" }}>{item.title}</p>
            <p style={{ fontSize: "12px", color: "#ccc" }}>修改</p>
          </div>
          <div style={{ fontSize: "13px", color: "#999" }}>
            {item.text}
          </div>
        </div>
       
      </div>)}
      </Radio.Group>
    </>
  );
}
